读书笔记-《JavaScript DOM编程艺术》

第1章

第2章

1.最好的方法是将<script>标签放在HTML文档的最后，</body>之前，这样可以使得浏览器更快的加载页面。

2.解释型语言

3.注释：建议用

//单行注释

/* 
    多行注释
    多行注释
*/

4.变量区分大小写

5.弱类型语言，不需要类型声明。

6.支持字符串.数值.浮点数.布尔值.

7.数组Array，数组中的元素可以是不同类型的数据，或者变量
如：

var arr = Array(4);
var arr = Array();
arr[2]="test";

var arr = [1,2,3,"test"];

关联数组

8.对象
声明对象：

var lennon = Object();
lennon.name = "John";
lennon.year = 1940;
lennon.isLiving = false;

或者：

1	var lennon = {name:"John", year:1940, isLiving:false};//这不是JSON吗？

9.条件语句 if(){}else{}同Java一样

10.=，==，===
= 赋值
== 比较值，不严格，””==false，成立！
=== 严格比较，不仅比较值，还会比较变量的类型

11.用户自定义对象

1	var liuhao = new Person;//和java相比，没有括号

12.内建对象:Array.Math.Date
数组，

1 2	var persons = new Array(); persons.length;

13.宿主对象：由运行环境（Web浏览器）提供的，包括Form.Image.Element等，用来获取网页上的表单.表单元素等信息

第3章

14.DOM：Document.Object.Model。加载到当前窗口的网页，可以使用js去读取其中的内容。

15.window对象，对应浏览器本身，其属性和方法通常称为BOM（浏览器对象模型）。window.open.window.blur等方法。各种弹出广告的实现

16.HTML DOM 树形结构:

17.CSS的简单使用

1
2
3

selector{
    property:value;
}

如：

p{
    color:yellow;
    font-size:1.2em;
}

18.CSS属性的继承：节点树上的各个元素将继承其父元素的样式属性，如：

body{
    color:white;
    background-color:black;
}

将作用于嵌套在body元素内部的所有元素。

19.class属性：可以在所有的元素上添加class属性：

1 2	<p class="special">This is a special p.<p/> <h2 class="special">This is a special p.</h2>

可以通过如下的方式设置上面两个元素的属性：

1
2
3

.special{
    font-style:italic;
}

也可以单独设置某种元素的class属性：

1
2
3

p.special{
    font-style:italic;
}

20.id属性：网页元素的唯一标示符，对于<ul id="abc">，可以这样设置它的属性：

1
2
3

#abc{
    color:black
}

也可以利用id属性为包含在该元素中的其他元素设置样式：

1
2
3

#abc li{
    font-style:italic;
}

21.获取元素对象：通过ID.标签名（如p.li等标签）.类名

document.getElementById("demo")：返回一个对象
element.getElementsByTagName("li")：返回一个对象数组，其中每个对象对应着文档中有着给定标签的一个元素。该方法允许使用通配符，
getElementsByClassName()：返回一个对象数组，可以查找带有多个类名的元素。

22.获取设置元素属性

object.getAttribute(attribute)，attribute：待查询元素的属性的名字，
如不要忘了买这些！里的title属性
object.setAttribute(attribute,value)，将属性attribute的值设置为value

23.DOM工作模式：先加载文档的静态内容，再动态刷新，动态刷新不影响文档的静态内容。

第4章

24.事件函数的处理机制：在给某个元素添加了事件处理函数（如onclick）后，一旦事件发生，就会执行相应的JavaScript代码，被调用的JavaScript代码可以返回一个值，这个值将会传递给那个事件处理函数（onclick）。例如，给一个链接添加一个onclick函数，并让该函数返回一个布尔类型的值。这样一来，当这个链接被点击时，如果那段代码返回了true，那么onclick函数就认为这个“链接被点击了”；如果返回了false，那么就会认为这个链接“没有被点击”。
如：

1	<a href="http://www.baidu.com" onclick="return false;">点我</a>

点击后，将不会触发链接默认的行为（跳转）。

25.想在页面加载时运行函数count，可以这样设置

1	window.onload = count;

26.childNodes属性：可以用来获取任何一个元素的所有子元素，是一个包含其全部子元素的数组，包含的不仅仅是元素节点（ul、img等），甚至连空格和换行符都被当作节点。

27.nodeType属性：node.nodeType获取节点的nodeType属性，返回的是一个数字，共有12种取值，常用的有：

元素节点：1
属性节点：2
文本节点：3

28.nodeValue属性：node.nodeValue获取/设定一个节点的值。

1	<p id="description">选个图吧</p>

的nodeValue属性将是一个空值null，包含在元素中的文本是另外一个节点，是元素的一个子节点。

29.firstChild和lastChild属性：
node.firstChild等价于node.childNodes[0]，
node.lastChild等价于node.childNodes[node.childNodes.length-1]

待更新。。。